<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Perpsective Units</title>
  <style type="text/css" media="screen">
      .container {
          display: inline-block;
          height: 150px;
          width: 200px;
          margin: 10px 20px;
          border: 1px solid black;
          -webkit-perspective-origin: left top;
      }
      
      .content {
          height: 100%;
          width: 100%;
          background-color: blue;
          transform: rotateX(45deg);
      }
  </style>
</head>
<body>

  <p>-webkit-perspective should take units. All four should look qualitatively similar.</p>
  <div class="container" style="-webkit-perspective: 400">
      <div class="content">
      </div>
  </div>

  <div class="container" style="-webkit-perspective: 400px">
      <div class="content">
      </div>
  </div>

  <div class="container" style="-webkit-perspective: 300pt">
      <div class="content">
      </div>
  </div>

  <br>

  <div class="container" style="zoom: 2; -webkit-perspective: 400px">
      <div class="content">
      </div>
  </div>

</body>
</html>
